<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge" >
  <link rel="dns-prefetch" href="//litten.me">
  <title>Litten的博客</title>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <meta name="description" content="华中科技大学09级，就职于腾讯SNG。擅长各项前端技能，深入研究移动端开发与前端性能。非专业视觉设计师。此为博客一枚。">
<meta property="og:type" content="website">
<meta property="og:title" content="Litten的博客">
<meta property="og:url" content="//litten.me/index.html">
<meta property="og:site_name" content="Litten的博客">
<meta property="og:description" content="华中科技大学09级，就职于腾讯SNG。擅长各项前端技能，深入研究移动端开发与前端性能。非专业视觉设计师。此为博客一枚。">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="Litten的博客">
<meta name="twitter:description" content="华中科技大学09级，就职于腾讯SNG。擅长各项前端技能，深入研究移动端开发与前端性能。非专业视觉设计师。此为博客一枚。">
  
    <link rel="alternative" href="/atom.xml" title="Litten的博客" type="application/atom+xml">
  
  
    <link rel="icon" href="/assets/img/favicon.ico">
  
  <link rel="stylesheet" href="/main.css?v=4.0.0.css">
  

</head>

<body>
  <div id="container" q-class="show:isCtnShow">
    <canvas id="anm-canvas" class="anm-canvas"></canvas>
    <div class="left-col" q-class="show:isShow">
      <div class="overlay"></div>
<div class="intrude-less">
	<header id="header" class="inner">
		<a href="/" class="profilepic">
			<img src="/assets/blogImg/litten.png" class="js-avatar">
		</a>

		<hgroup>
		  <h1 class="header-author"><a href="/">Litten</a></h1>
		</hgroup>

		
		<p class="header-subtitle">胆小认生，不易相处</p>
		

		<nav class="header-menu">
			<ul>
			
				<li><a href="/">主页</a></li>
	        
				<li><a href="/photos">相册</a></li>
	        
			</ul>
		</nav>
		<nav class="header-smart-menu">
	        
    		
    			
    			<a data-idx="0" q-on="click: openSlider(e, 'innerArchive')" href="javascript:void(0)">所有文章</a>
    			
    			
            
    			
            
    			
    			<a data-idx="1" q-on="click: openSlider(e, 'aboutme')" href="javascript:void(0)">关于我</a>
    			
    			
            
		</nav>
		<nav class="header-nav">
			<div class="social">
				
					<a class="github" target="_blank" href="https://github.com/litten" title="github"><i class="icon-github"></i></a>
		        
					<a class="weibo" target="_blank" href="http://weibo.com/litten225" title="weibo"><i class="icon-weibo"></i></a>
		        
					<a class="rss" target="_blank" href="/atom.xml" title="rss"><i class="icon-rss"></i></a>
		        
			</div>
		</nav>
	</header>		
</div>

    </div>
    <div class="mid-col" q-class="show:isShow,hide:isShow|isFalse">
      <nav id="mobile-nav">
  	<div class="overlay">
  		<div class="slider-trigger"><i class="icon-sort"></i></div>
  		<h1 class="header-author js-mobile-header hide">Litten</h1>
  	</div>
	<div class="intrude-less">
		<header id="header" class="inner">
			<div class="profilepic">
				<img src="/assets/blogImg/litten.png" class="js-avatar">
			</div>
			<hgroup>
			  <h1 class="header-author">Litten</h1>
			</hgroup>
			
			<p class="header-subtitle">胆小认生，不易相处</p>
			
			<nav class="header-menu">
				<ul>
				
					<li><a href="/">主页</a></li>
		        
					<li><a href="/photos">相册</a></li>
		        
		        
		        	<li><a href="/archives">所有文章</a></li>
		        
				</ul>
			</nav>
			<nav class="header-nav">
				<div class="social">
					
						<a class="github" target="_blank" href="https://github.com/litten" title="github"><i class="icon-github"></i></a>
			        
						<a class="weibo" target="_blank" href="http://weibo.com/litten225" title="weibo"><i class="icon-weibo"></i></a>
			        
						<a class="rss" target="_blank" href="/atom.xml" title="rss"><i class="icon-rss"></i></a>
			        
				</div>
			</nav>
		</header>				
	</div>
</nav>

      <div id="wrapper" class="body-wrap">
        <div class="menu-l">
          <div class="canvas-wrap">
            <canvas data-colors="#eaeaea" data-sectionHeight="100" data-contentId="js-content" id="myCanvas1" class="anm-canvas"></canvas>
          </div>
          <div id="js-content" class="content-ll">
            
  
    <article id="post-diary-2016-1030-1105" class="article article-type-post  article-index" itemscope itemprop="blogPost">
  <div class="article-inner">
    
      <header class="article-header">
        
  
    <h1 itemprop="name">
      <a class="article-title" href="/2016/11/06/diary-2016-1030-1105/">旧事 哪天才能歌唱的话 10.30-11.05</a>
    </h1>
  

        <a href="/2016/11/06/diary-2016-1030-1105/" class="archive-article-date">
  	<time datetime="2016-11-06T02:36:00.000Z" itemprop="datePublished"><i class="icon-calendar icon"></i>2016-11-06</time>
</a>
      </header>
    
    <div class="article-entry" itemprop="articleBody">
      
        <iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="http://music.163.com/outchain/player?type=2&id=694286&auto=0&height=66"></iframe>

<p>想起网易账户密码泄露，就发生在10月底。<br>去年的这个时候，我是受害者之一。</p>
<p>但我没有着急改密码。<br>一是因为那个时候，我过着一种近乎抑郁灰白的生活。<br>所有的社交工具都停掉了，也不与人交流。<br>很多事情我不愿碰。<br>像燃尽的烟柱，自己伸手一掸，搞不好满世界尘埃<br>还不如让风来悄悄瘗埋。</p>
<p>二是因为一位神秘的朋友闯进了生活。<br>我很喜欢冲绳民谣，在云音乐里上传了BEGIN的《三线の花》与《笑颜不变》。<br>这位朋友搞到我的账号密码后，貌似没做什么坏事，光给我推荐歌曲了…<br>TA先上传了没有版权的《岛人ぬ宝》，再后来是夏川和中孝介的一些歌。<br>那时，这些音乐，居然成了我跟外界连通的唯一绳索。</p>
        <a class="article-more-a"  href="/2016/11/06/diary-2016-1030-1105/#more">more >></a>
      

      
    </div>
    <div class="article-info article-info-index">
      
      
	<div class="article-tag tagcloud">
		<i class="icon-price-tags"></i>
		<ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/旧事/">旧事</a></li></ul>
	</div>

      

      
        <p class="article-more-link">
          <a class="article-more-a" href="/2016/11/06/diary-2016-1030-1105/#more">展开全文 >></a>
        </p>
      

      
      <div class="clearfix"></div>
    </div>
  </div>
</article>








  
    <article id="post-diary-2016-1023-1029" class="article article-type-post  article-index" itemscope itemprop="blogPost">
  <div class="article-inner">
    
      <header class="article-header">
        
  
    <h1 itemprop="name">
      <a class="article-title" href="/2016/10/30/diary-2016-1023-1029/">旧事 木头人 10.23-10.29</a>
    </h1>
  

        <a href="/2016/10/30/diary-2016-1023-1029/" class="archive-article-date">
  	<time datetime="2016-10-30T02:36:00.000Z" itemprop="datePublished"><i class="icon-calendar icon"></i>2016-10-30</time>
</a>
      </header>
    
    <div class="article-entry" itemprop="articleBody">
      
        <p><img src="/assets/blogImg/diary-15.jpg" alt=""></p>
<p>10月的最后一周，想在天气变冷前，完成一组照片。<br>主题跟树林有关，因为我很喜欢这个季节树叶的厚重感。<br>不过，木头比人难拍太多了。<br>人非草木，起码有表情，有温度，可以装扮。<br>有两次回来，我直接就把照片全删了，心情不太爽，怎么想都是这些树木不配合。</p>
<p>后来妥协，是不是我得自己做些改变，营造一种拟人的环境呢？<br>因此按快门时，我都很平常的喊一声：“一二三茄子！”<br>那时天色已黑，别人一看这里没人啊…<br>吓坏了两个孩子。<br>对不起！</p>
<p>另外，一个很重要的经验<br>去小树林记得要带six god…</p>

      

      
    </div>
    <div class="article-info article-info-index">
      
      
	<div class="article-tag tagcloud">
		<i class="icon-price-tags"></i>
		<ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/旧事/">旧事</a></li></ul>
	</div>

      

      
        <p class="article-more-link">
          <a class="article-more-a" href="/2016/10/30/diary-2016-1023-1029/#more">展开全文 >></a>
        </p>
      

      
      <div class="clearfix"></div>
    </div>
  </div>
</article>








  
    <article id="post-diary-2016-1016-1022" class="article article-type-post  article-index" itemscope itemprop="blogPost">
  <div class="article-inner">
    
      <header class="article-header">
        
  
    <h1 itemprop="name">
      <a class="article-title" href="/2016/10/23/diary-2016-1016-1022/">旧事 荔枝永远红不了 10.16-10.22</a>
    </h1>
  

        <a href="/2016/10/23/diary-2016-1016-1022/" class="archive-article-date">
  	<time datetime="2016-10-23T02:36:00.000Z" itemprop="datePublished"><i class="icon-calendar icon"></i>2016-10-23</time>
</a>
      </header>
    
    <div class="article-entry" itemprop="articleBody">
      
        <p><img src="/assets/blogImg/diary-14.jpg" alt=""></p>
<p>这只猫，是我在公园认识的。<br>一年前它还很小，每天穿行于古旧的荔枝林。<br>傍晚我习惯到公园跑步，总能在固定的地点，看到阳光把它拉成巨大猛兽的情景。<br>然而它更喜欢阴影。</p>
<p>第一次碰到它，他就躲在阴影里。<br>因为是在车底，给它起了个名字<br>叫阿杜…（逻辑满分，拒绝吐槽）</p>
        <a class="article-more-a"  href="/2016/10/23/diary-2016-1016-1022/#more">more >></a>
      

      
    </div>
    <div class="article-info article-info-index">
      
      
	<div class="article-tag tagcloud">
		<i class="icon-price-tags"></i>
		<ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/旧事/">旧事</a></li></ul>
	</div>

      

      
        <p class="article-more-link">
          <a class="article-more-a" href="/2016/10/23/diary-2016-1016-1022/#more">展开全文 >></a>
        </p>
      

      
      <div class="clearfix"></div>
    </div>
  </div>
</article>








  
    <article id="post-diary-2016-1008-1015" class="article article-type-post  article-index" itemscope itemprop="blogPost">
  <div class="article-inner">
    
      <header class="article-header">
        
  
    <h1 itemprop="name">
      <a class="article-title" href="/2016/10/20/diary-2016-1008-1015/">旧事 返校日 10.8-10.15</a>
    </h1>
  

        <a href="/2016/10/20/diary-2016-1008-1015/" class="archive-article-date">
  	<time datetime="2016-10-20T02:36:00.000Z" itemprop="datePublished"><i class="icon-calendar icon"></i>2016-10-20</time>
</a>
      </header>
    
    <div class="article-entry" itemprop="articleBody">
      
        <p><img src="/assets/blogImg/diary-13.jpg" alt=""></p>
<p>“我要回武汉！”<br>这句话说了一千遍，终于兑现成一张动车票。</p>
<p>三年前，毕业的第二天，行李被盗，大学时所有的物件付之东流。<br>背着空空的行囊回家，越想越委屈，导演剧本不对啊，人家西游记八十一难，好歹是个HAPPY ENDING…<br>感觉自己有一种迷之体质，总可以把平静的生活过得波澜壮阔。<br>左脸黑线，右脸微笑，这种技能不是谁都可以，我在考虑要不申个遗。</p>
<p>总之，国庆后大家都返工，过上岁月静好的生活时，我一个人扛起了到武汉搞事情的大旗。</p>
        <a class="article-more-a"  href="/2016/10/20/diary-2016-1008-1015/#more">more >></a>
      

      
    </div>
    <div class="article-info article-info-index">
      
      
	<div class="article-tag tagcloud">
		<i class="icon-price-tags"></i>
		<ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/旧事/">旧事</a></li></ul>
	</div>

      

      
        <p class="article-more-link">
          <a class="article-more-a" href="/2016/10/20/diary-2016-1008-1015/#more">展开全文 >></a>
        </p>
      

      
      <div class="clearfix"></div>
    </div>
  </div>
</article>








  
    <article id="post-diary-2016-1001-1007" class="article article-type-post  article-index" itemscope itemprop="blogPost">
  <div class="article-inner">
    
      <header class="article-header">
        
  
    <h1 itemprop="name">
      <a class="article-title" href="/2016/10/08/diary-2016-1001-1007/">旧事 Way Home 10.1-10.7</a>
    </h1>
  

        <a href="/2016/10/08/diary-2016-1001-1007/" class="archive-article-date">
  	<time datetime="2016-10-08T02:36:00.000Z" itemprop="datePublished"><i class="icon-calendar icon"></i>2016-10-08</time>
</a>
      </header>
    
    <div class="article-entry" itemprop="articleBody">
      
        <p><img src="/assets/blogImg/diary-10.jpg" alt=""></p>
<p>《Way Home》是押尾的一首指弹，算不上热门，听的人也少。<br>我不喜欢一首吉他曲太过工整，羽翼丰满的老鹰，就没有了小鸟的自在。<br>不过，教科书般的工整，就有一种禁锢的美感。<br>音符好似尺子上的刻度，不差分毫。<br>如果时间也是一把尺子，那回家这件事也应该是清晰有力的刻度吧。</p>
<p>九月的最后一天，听着它，回了家。</p>
<p>推开门，好像一个转场回到从前，书包一丢，喊一句：我回来了，好累啊<br>然后倒在沙发上等吃的，电视上正放着《数码宝贝》。<br>这才应该是那个“无限大な梦”啊！</p>
        <a class="article-more-a"  href="/2016/10/08/diary-2016-1001-1007/#more">more >></a>
      

      
    </div>
    <div class="article-info article-info-index">
      
      
	<div class="article-tag tagcloud">
		<i class="icon-price-tags"></i>
		<ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/旧事/">旧事</a></li></ul>
	</div>

      

      
        <p class="article-more-link">
          <a class="article-more-a" href="/2016/10/08/diary-2016-1001-1007/#more">展开全文 >></a>
        </p>
      

      
      <div class="clearfix"></div>
    </div>
  </div>
</article>








  
    <article id="post-diary-2016-0911-0924" class="article article-type-post  article-index" itemscope itemprop="blogPost">
  <div class="article-inner">
    
      <header class="article-header">
        
  
    <h1 itemprop="name">
      <a class="article-title" href="/2016/09/25/diary-2016-0911-0924/">旧事 凯里 9.11-9.24</a>
    </h1>
  

        <a href="/2016/09/25/diary-2016-0911-0924/" class="archive-article-date">
  	<time datetime="2016-09-25T02:36:00.000Z" itemprop="datePublished"><i class="icon-calendar icon"></i>2016-09-25</time>
</a>
      </header>
    
    <div class="article-entry" itemprop="articleBody">
      
        <p><img src="/assets/blogImg/diary-9.jpg" alt=""></p>
<blockquote>
<p><em>市面上的web相册都不好用，干脆自己做了个<a href="http://litten.me/gallery/%E7%8E%A9%C2%B7%E5%87%AF%E9%87%8C?password=guest">相册</a>，github开源，取名为<a href="https://github.com/litten/zing-gallery">Zing</a>，待填坑…</em></p>
</blockquote>
<hr>
<p>6月初，要上腾讯大讲堂分享。<br>PPT准备得差不多，缺了个演讲的节奏。<br>我希望的风格是逻辑分明，又不会太过枯燥的，但均衡好这两者并不简单。</p>
<p>又发觉，“逻辑分明”加“不太枯燥”，<br>掌握不好节奏，就是“一本正经“加”胡说八道”的意思呀！<br>这让我有点慌，搞不好过不久别人就指着我说：看，前端界的泥石流…</p>
<p>于是那几天，一直听“一席”来找灵感。<br><a href="http://yixi.tv/lecture/366">毕赣《路边野餐》</a>的那一段意外的好，也从中深深地记住了一个陌生的地名：<strong>凯里</strong>。</p>
<p>我喜欢那种，经行语言（而不是光影）就能渲染出来的，边陲小镇特有的青翠与市侩。</p>
        <a class="article-more-a"  href="/2016/09/25/diary-2016-0911-0924/#more">more >></a>
      

      
    </div>
    <div class="article-info article-info-index">
      
      
	<div class="article-tag tagcloud">
		<i class="icon-price-tags"></i>
		<ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/旧事/">旧事</a></li></ul>
	</div>

      

      
        <p class="article-more-link">
          <a class="article-more-a" href="/2016/09/25/diary-2016-0911-0924/#more">展开全文 >></a>
        </p>
      

      
      <div class="clearfix"></div>
    </div>
  </div>
</article>








  
    <article id="post-diary-2016-0904-0910" class="article article-type-post  article-index" itemscope itemprop="blogPost">
  <div class="article-inner">
    
      <header class="article-header">
        
  
    <h1 itemprop="name">
      <a class="article-title" href="/2016/09/11/diary-2016-0904-0910/">旧事 imweb-conf 9.4-9.10</a>
    </h1>
  

        <a href="/2016/09/11/diary-2016-0904-0910/" class="archive-article-date">
  	<time datetime="2016-09-11T02:36:00.000Z" itemprop="datePublished"><i class="icon-calendar icon"></i>2016-09-11</time>
</a>
      </header>
    
    <div class="article-entry" itemprop="articleBody">
      
        <p>“<a href="http://imweb.io/topic/57d8ded5eebf12d673f74cdc?utm_source=tuicool&amp;utm_medium=referral" target="_blank" rel="external">imweb-conf 2016</a> ”周六开始<br>每到这个时候，都觉得一年又过去得这么快。<br>今年，有直播，有嘉宾，居然还有饭吃，太厉害了。</p>
<p>回想自己第一次上台，也是在这个大会。<br>不过，当时说的啥肯定很傻。<br>但记得我做了个不错的开场。<br>果然吹牛更能达成诗和远方、光芒万丈的效果。</p>
<p>另外一个期待，就是能见着许多老朋友<br>他们风尘仆仆，从各地赶来。<br>八千里路云和月，千里江陵一日还，仿佛一种迷之仪式感，出场的时候都应该会有bgm响起</p>
<p>然而周六那天，突然就发烧了<br>应该是前两夜熬夜做设计带来的连锁反应。<br>那晚做了个梦：皓月当空，天光似水<br>而我的想法居然是，这个月亮好碍眼，怎么用图章工具把这月亮给干掉…</p>
<p>Photoshop有毒，真的。</p>
<p>恍惚中想起那个，每年惊蛰，朋友从东方带来一壶酒的故事…<br>然而早已白露而不是惊蛰，世间上也没有那壶叫醉生梦死的酒。</p>

      

      
    </div>
    <div class="article-info article-info-index">
      
      
	<div class="article-tag tagcloud">
		<i class="icon-price-tags"></i>
		<ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/旧事/">旧事</a></li></ul>
	</div>

      

      
        <p class="article-more-link">
          <a class="article-more-a" href="/2016/09/11/diary-2016-0904-0910/#more">展开全文 >></a>
        </p>
      

      
      <div class="clearfix"></div>
    </div>
  </div>
</article>








  
    <article id="post-diary-2016-0814-0820" class="article article-type-post  article-index" itemscope itemprop="blogPost">
  <div class="article-inner">
    
      <header class="article-header">
        
  
    <h1 itemprop="name">
      <a class="article-title" href="/2016/08/21/diary-2016-0814-0820/">旧事 奥运 8.14-8.20</a>
    </h1>
  

        <a href="/2016/08/21/diary-2016-0814-0820/" class="archive-article-date">
  	<time datetime="2016-08-21T02:36:00.000Z" itemprop="datePublished"><i class="icon-calendar icon"></i>2016-08-21</time>
</a>
      </header>
    
    <div class="article-entry" itemprop="articleBody">
      
        <p><img src="/assets/blogImg/diary-5.jpg" alt="by Chow Hon Lam on Dribble"> </p>
<p>每晚小板凳备好，乐呵去守着CCTV5<br>里约这个时差刚刚好，反正我忙得不行，只有晚上这点属于自己的时间。</p>
<p>这两周主要看乒乓赛事<br>最好看还是男团张继科打郑荣植那场<br>郑的反手很强，张却持续使用反手拧拉<br>攻彼之长，陷入苦战</p>
<p>杨影相当着急，也说张应该选择打正手<br>扬长避短，吃瓜群众都看得出来，何尝张不知道呢？<br>只是，如果这么做，他就可能是马琳或刘国梁，而不是那个鲜衣怒马的张继科了。</p>
<p>可能这才是我喜欢的奥运吧。</p>
<p>人有时候，<br>就应该热血而执拗<br>就应该忽略掉喋喋不休的劝诫<br>就应该蠢到无与伦比，不懂变通<br>只为在最终的最终，说上一句：<br>“还是我赢了”。</p>

      

      
    </div>
    <div class="article-info article-info-index">
      
      
	<div class="article-tag tagcloud">
		<i class="icon-price-tags"></i>
		<ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/旧事/">旧事</a></li></ul>
	</div>

      

      
        <p class="article-more-link">
          <a class="article-more-a" href="/2016/08/21/diary-2016-0814-0820/#more">展开全文 >></a>
        </p>
      

      
      <div class="clearfix"></div>
    </div>
  </div>
</article>








  
  
    <nav id="page-nav">
      <span class="page-number current">1</span><a class="page-number" href="/page/2/">2</a><a class="page-number" href="/page/3/">3</a><span class="space">&hellip;</span><a class="page-number" href="/page/8/">8</a><a class="extend next" rel="next" href="/page/2/">Next &raquo;</a>
    </nav>
  


          </div>
        </div>
      </div>
      <footer id="footer">
  <div class="outer">
    <div id="footer-info">
    	<div class="footer-left">
    		&copy; 2016 Litten
    	</div>
      	<div class="footer-right">
      		<a href="http://hexo.io/" target="_blank">Hexo</a>  Theme <a href="https://github.com/litten/hexo-theme-yilia" target="_blank">Yilia</a> by Litten
      	</div>
    </div>
  </div>
</footer>
    </div>
    <script>
	var yiliaConfig = {
		mathjax: false,
		isHome: true,
		isPost: false,
		isArchive: false,
		isTag: false,
		isCategory: false,
		open_in_new: true,
		root: "/",
		innerArchive: true
	}
</script>

<script src="/./main.js?v=4.0.0.js"></script>


    
<div class="tools-col" q-class="show:isShow,hide:isShow|isFalse" q-on="click:stop(e)">
  <div class="tools-wrap">
    
    	<section class="tools-section tools-section-all" q-show="innerArchive">
        <div class="search-wrap">
          <input class="search-ipt" q-model="search" type="text" placeholder="find something…">
          <i class="icon-search icon" q-show="search|isEmptyStr"></i>
          <i class="icon-close icon" q-show="search|isNotEmptyStr" q-on="click:clearChose(e)"></i>
        </div>
        <div class="widget tagcloud search-tag">
          <p class="search-tag-wording">tag:</p>
          <label class="search-switch">
            <input type="checkbox" q-on="click:toggleTag(e)" q-attr="checked:showTags">
          </label>
          <ul class="article-tag-list" q-show="showTags">
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">js</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">html5</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">设计</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">杂谈</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">游戏</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">旧事</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">coffeescript</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">web</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">旅行</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">css</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">css3</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">工具</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">chrome</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">生活</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">安全</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">黑科技</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">octopress</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">浏览器</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">主题</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">hexo</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">经验</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">产品</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">前端</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">github</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">药别停</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">模式</a>
              </li>
             
              <li class="article-tag-list-item">
                <a href="javascript:void(0)">性能</a>
              </li>
            
            <div class="clearfix"></div>
          </ul>
        </div>
        <ul class="search-ul">
          <p q-show="jsonFail" style="padding: 20px; font-size: 12px;">
            缺失模块。<br/>1、在博客根目录（注意不是yilia根目录）执行以下命令：<br/> npm i hexo-generator-json-content --save<br/><br/>
            2、在根目录_config.yml里添加配置：
<pre style="font-size: 12px;" q-show="jsonFail">
  jsonContent:
    meta: false
    pages: false
    posts:
      title: true
      date: true
      path: true
      text: true
      raw: false
      content: false
      slug: false
      updated: false
      comments: false
      link: false
      permalink: false
      excerpt: false
      categories: false
      tags: true
</pre>
          </p>
          <li class="search-li" q-repeat="items" q-show="isShow">
            <a q-attr="href:path|urlformat" class="search-title"><i class="icon-quo-left icon"></i><span q-text="title"></span></a>
            <p class="search-time">
              <i class="icon-calendar icon"></i>
              <span q-text="date|dateformat"></span>
            </p>
            <p class="search-tag">
              <i class="icon-price-tags icon"></i>
              <span q-repeat="tags" q-on="click:choseTag(e, name)" q-text="name|tagformat"></span>
            </p>
          </li>
        </ul>
    	</section>
    

    

    
    	<section class="tools-section tools-section-me" q-show="aboutme">
  	  	
  	  		<div class="aboutme-wrap" id="js-aboutme">Litten，&lt;br&gt;毕业于华科，就职于鹅厂&lt;br&gt;&lt;br&gt;热爱大海与冷笑话，&lt;br/&gt;目前是一枚前端&lt;br/&gt;&lt;br/&gt;胆小认生，不易相处，&lt;br&gt;年轻无为，卖马为生。</div>
  	  	
    	</section>
    
  </div>
  
</div>
    <!-- Root element of PhotoSwipe. Must have class pswp. -->
<div class="pswp" tabindex="-1" role="dialog" aria-hidden="true">

    <!-- Background of PhotoSwipe. 
         It's a separate element as animating opacity is faster than rgba(). -->
    <div class="pswp__bg"></div>

    <!-- Slides wrapper with overflow:hidden. -->
    <div class="pswp__scroll-wrap">

        <!-- Container that holds slides. 
            PhotoSwipe keeps only 3 of them in the DOM to save memory.
            Don't modify these 3 pswp__item elements, data is added later on. -->
        <div class="pswp__container">
            <div class="pswp__item"></div>
            <div class="pswp__item"></div>
            <div class="pswp__item"></div>
        </div>

        <!-- Default (PhotoSwipeUI_Default) interface on top of sliding area. Can be changed. -->
        <div class="pswp__ui pswp__ui--hidden">

            <div class="pswp__top-bar">

                <!--  Controls are self-explanatory. Order can be changed. -->

                <div class="pswp__counter"></div>

                <button class="pswp__button pswp__button--close" title="Close (Esc)"></button>

                <button class="pswp__button pswp__button--share" style="display:none" title="Share"></button>

                <button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button>

                <button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button>

                <!-- Preloader demo http://codepen.io/dimsemenov/pen/yyBWoR -->
                <!-- element will get class pswp__preloader--active when preloader is running -->
                <div class="pswp__preloader">
                    <div class="pswp__preloader__icn">
                      <div class="pswp__preloader__cut">
                        <div class="pswp__preloader__donut"></div>
                      </div>
                    </div>
                </div>
            </div>

            <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
                <div class="pswp__share-tooltip"></div> 
            </div>

            <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)">
            </button>

            <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)">
            </button>

            <div class="pswp__caption">
                <div class="pswp__caption__center"></div>
            </div>

        </div>

    </div>

</div>
  </div>
</body>
</html>